<template>
  <el-dialog :title="!dataForm.id ? '新增' : '修改'"  :close-on-click-modal="false" :visible.sync="visible">
    <dev class="panel  flex " v-loading="loading">
    <el-form :model="dataForm" :rules="dataRule"  ref="dataForm" @keyup.enter.native="dataFormSubmit()"
      label-width="80px">
      <el-form-item label="类型" prop="type">
        <el-radio-group v-model="dataForm.type">
          <el-radio v-for="(type, index) in dataForm.typeList" :label="index" :key="index">{{ type }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <!-- <el-form-item label="appid" prop="appid">
      <el-input v-model="dataForm.appid" placeholder="appid"></el-input>
    </el-form-item> -->
      <el-form-item label="上级" prop="parentId" v-if="dataForm.type != 0">
        <!-- <el-input v-model="dataForm.parentId" placeholder="父ID，小区为0"></el-input> -->
        <el-popover ref="parentListPopover" placement="bottom-start" trigger="click" v-model="popoverVisible">
          <el-tree :data="parentList" :props="parentTreeProps" node-key="id" ref="parentListTree"
            @current-change="parentListTreeCurrentChangeHandle" :default-expand-all="false" :highlight-current="true"
            :expand-on-click-node="false">
          </el-tree>
        </el-popover>
        <el-input v-model="dataForm.parentName" v-popover:parentListPopover :readonly="true" placeholder="点击选择上级"
          class="menu-list__input"></el-input>

      </el-form-item>
      <!-- <el-form-item label="地址类型 0：小区  1：楼  2：单元" prop="type">
      <el-input v-model="dataForm.type" placeholder="地址类型 0：小区  1：楼  2：单元"></el-input>
    </el-form-item> -->
      <el-form-item :label="dataForm.type == 0 ? '名称' : dataForm.type == 1 ? '楼号' : '单元'" prop="name">
        <el-input v-model="dataForm.name" :placeholder="dataForm.type == 0 ? '名称' : dataForm.type == 1 ? '楼号' : '单元'">
        </el-input>
      </el-form-item>
    </el-form>
  </dev>
  <span slot="footer" class="dialog-footer">
    <el-button @click="visible = false" :loading="loading">取消</el-button>
    <el-button type="primary" :loading="loading" @click="dataFormSubmit()">确定</el-button>
  </span>
</el-dialog>
</template>

<script>
import { treeDataTranslate } from '@/utils'
export default {
  data() {
    return {
      visible: false,
      popoverVisible: false,
      loading:false,
      dataForm: {
        id: 0,
        appid: '',
        parentId: '',
        parentName: '',
        type: '',
        name: '',
        sceneStr: '',
        ticket: '',
        url: '',
        typeList: ['小区', '楼', '单元'],
      },
      parentList: [],
      parentTreeProps: {
        label: 'name',
        children: 'children'
      },
      dataRule: {
        type: [
          { required: true, message: '地址类型 0：小区  1：楼  2：单元不能为空', trigger: 'blur' }
        ],
        name: [
          { required: true, message: '地址名称不能为空', trigger: 'blur' }
        ],
      }
    }
  },
  methods: {
    init(id) {
      // console.log("init");
      this.dataForm = {
        id: 0,
        appid: '',
        parentId: '',
        parentName: '',
        type: 0,
        name: '',
        sceneStr: '',
        ticket: '',
        url: '',
        typeList: ['小区', '楼', '单元'],
      },
        this.dataForm.id = id || 0
      this.$http({
        url: this.$http.adornUrl('/sys/address/list'),
        method: 'get',
        params: this.$http.adornParams()
      }).then(({ data }) => {
        this.parentList = treeDataTranslate(data.page)
      }).then(() => {
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
        })
      }).then(() => {
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.id) {
            this.$http({
              url: this.$http.adornUrl(`/sys/address/info/${this.dataForm.id}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({ data }) => {
              if (data && data.code === 200) {
                this.dataForm.appid = data.address.appid
                this.dataForm.tagId = data.address.tagId
                this.dataForm.tagName = data.address.tagName
                this.dataForm.parentId = data.address.parentId
                this.dataForm.parentName = data.address.parentName
                this.dataForm.type = data.address.type
                this.dataForm.name = data.address.name
                this.dataForm.sceneStr = data.address.sceneStr
                this.dataForm.ticket = data.address.ticket
                this.dataForm.url = data.address.url
              }
            })
          }
        })
      })
    },
    // 表单提交
    dataFormSubmit() {
      this.loading = true
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          //添加标签
          // this.saveTag()
          this.$http({
            url: this.$http.adornUrl(`/sys/address/${!this.dataForm.id ? 'save' : 'update'}`),
            method: 'post',
            data: this.$http.adornData({
              'id': this.dataForm.id || undefined,
              'appid': this.dataForm.appid,
              'tagId': this.dataForm.tagId,
              'tagName': this.dataForm.tagName,
              'parentId': this.dataForm.parentId,
              'parentName': this.dataForm.parentName,
              'type': this.dataForm.type,
              'name': this.dataForm.name,
              'sceneStr': this.dataForm.sceneStr,
              'ticket': this.dataForm.ticket,
              'url': this.dataForm.url
            })
          }).then(({ data }) => {
            if (data && data.code === 200) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.visible = false
                  this.loading = false
                  this.$emit('refreshDataList')
                }
              })
            } else {
              this.$message.error(data.msg)
              this.loading = false
            }
          })
        }else{
          this.loading = false
        }
      })
    },
    parentListTreeCurrentChangeHandle(data, node) {
      this.dataForm.parentId = data.id
      this.dataForm.parentName = data.name
      this.popoverVisible = false
    },
    // 菜单树设置当前选中节点
    parentListTreeSetCurrentNode() {
      this.$refs.menuListTree.setCurrentKey(this.dataForm.parentId)
      this.dataForm.parentName = (this.$refs.menuListTree.getCurrentNode() || {})['name']
    },
    //添加标签方法
    // saveTag(){
    //     let name = this.dataForm.name;
    //     if(this.dataForm.parentName){
    //         name = this.dataForm.parentName + this.dataForm.name;
    //     }
    //     //判断是否有上级标签
    //     if(this.dataForm.parentId){
    //         this.$http({
    //             url: this.$http.adornUrl(`/sys/address/info/${this.dataForm.parentId}`),
    //             method: 'post',
    //             data:this.$http.adornData()
    //         }).then(({ data }) => {
    //             //添加标签
    //                 this.$http({
    //                     //添加标签的请求地址
    //                     url: this.$http.adornUrl('/manage/wxUserTags/save'),
    //                     method: 'post',
    //                     data:this.$http.adornData({
    //                         id : undefined,
    //                         name : data.address.parentName + name
    //                     })
    //                 }).then(({ data }) => {
    //                     let tagId = data.tag.id
    //                     //添加地址方法
    //                     this.$http({
    //                         //根据有无id来判断所需要获取的URL
    //                         url: this.$http.adornUrl(`/sys/address/${!this.dataForm.id ? 'save' : 'update'}`),
    //                         method: 'post',
    //                         data: this.$http.adornData({
    //                             'id': this.dataForm.id || undefined,
    //                             'appid': this.dataForm.appid,
    //                             'tagId': tagId,
    //                             'parentId': this.dataForm.parentId,
    //                             'parentName':this.dataForm.parentName,
    //                             'type': this.dataForm.type,
    //                             'name': this.dataForm.name,
    //                             'sceneStr': this.dataForm.sceneStr,
    //                             'ticket': this.dataForm.ticket,
    //                             'url': this.dataForm.url
    //                         })
    //                     }).then(({data}) => {

    //                         if (data && data.code === 200) {
    //                             //添加标签
    //                             this.saveTag()
    //                             this.$message({
    //                                 message: '操作成功',
    //                                 type: 'success',
    //                                 duration: 1500,
    //                                 onClose: () => {
    //                                     this.visible = false
    //                                     this.$emit('refreshDataList')
    //                                 }
    //                             })
    //                         } else {
    //                             this.$message.error(data.msg)
    //                         }
    //                     })
    //                 })
    //             })
    //     }else{
    //         //添加标签
    //         this.$http({
    //             //添加标签的请求地址
    //             url: this.$http.adornUrl('/manage/wxUserTags/save'),
    //             method: 'post',
    //             data:this.$http.adornData({
    //                 id : undefined,
    //                 name : name
    //             })
    //         }).then(({ data }) => {
    //             let tagId = data.tag.id
    //             //添加地址信息
    //             this.$http({
    //                 //根据有无id来判断所需要获取的URL
    //                 url: this.$http.adornUrl(`/sys/address/${!this.dataForm.id ? 'save' : 'update'}`),
    //                 method: 'post',
    //                 data: this.$http.adornData({
    //                     'id': this.dataForm.id || undefined,
    //                     'appid': this.dataForm.appid,
    //                     'tagId': tagId,
    //                     'parentId': this.dataForm.parentId,
    //                     'parentName':this.dataForm.parentName,
    //                     'type': this.dataForm.type,
    //                     'name': this.dataForm.name,
    //                     'sceneStr': this.dataForm.sceneStr,
    //                     'ticket': this.dataForm.ticket,
    //                     'url': this.dataForm.url
    //                 })
    //             }).then(({data}) => {

    //                 if (data && data.code === 200) {
    //                     //添加标签
    //                     this.saveTag()
    //                     this.$message({
    //                         message: '操作成功',
    //                         type: 'success',
    //                         duration: 1500,
    //                         onClose: () => {
    //                             this.visible = false
    //                             this.$emit('refreshDataList')
    //                         }
    //                     })
    //                 } else {
    //                     this.$message.error(data.msg)
    //                 }
    //             })
    //         })
    //     }
    // }
  }
}
</script>
<style>
.panel {
    flex: 1;
}
</style>